<!--
 * @Description: In User Settings Edit
 * @Author: your name
 * @Date: 2019-08-27 21:30:56
 * @LastEditTime: 2019-08-27 21:38:09
 * @LastEditors: Please set LastEditors
 -->
<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport"
        content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>Hello APP</title>
    <link rel="stylesheet" type="text/css" href="../css/vant.css">
    <link rel="stylesheet" type="text/css" href="../css/base.css" />
    <script type="text/javascript" src="../script/jquery.js"></script>
    <script type="text/javascript" src="../script/vue.min.js"></script>
    <script type="text/javascript" src="../script/vant.min.js"></script>
    <script type="text/javascript" src="../script/fastclick.js"></script>
    <script type="text/javascript" src="../script/base.js"></script>
    <style type="text/css">
        /* * {
            box-sizing: border-box;
        }

        html,
        body {
            height: 100%;
        }

        #wrap {
            height: 100%;
            display: -webkit-box;
            display: -webkit-flex;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-flex-flow: column;
            flex-flow: column;
        }

        #header {
            text-align: center;
            background-color: #81a9c3;
            color: #fff;
            width: 100%;
            padding-top: 25px;
        }

        #header h1 {
            font-size: 20px;
            height: 44px;
            line-height: 44px;
            margin: 0em;
            color: #fff;
        }

        #main {
            -webkit-box-flex: 1;
            -webkit-flex: 1;
            flex: 1;
        }

        #footer {
            height: 30px;
            line-height: 30px;
            background-color: #81a9c3;
            width: 100%;
            text-align: center;
        }

        #footer h5 {
            color: white;
        } */

        .con {
            font-size: 28px;
            text-align: center;
        }

        .flex-con {
            overflow: auto
        }

        .scan {
            padding: 20px 140px 20px 10px;
            position: relative;
        }

        #scanCode {
            width: 100%;
            height: 34px;
            background: #e5e5e5;
            border-top-left-radius: 4px;
            border-top-right-radius: 0px;
            border-bottom-left-radius: 4px;
            border-bottom-right-radius: 0px;
            outline: none;
            padding-left: 10px;
            border: 0;
        }

        #searchButton {
            position: absolute;
            right: 80px;
            top: 20px;
            width: 60px;
            height: 34px;
            line-height: 34px;
            background: #e7d230;
            color: #fff;
            outline: none;
            border: 0;
        }

        #scanButton {
            position: absolute;
            right: 20px;
            top: 20px;
            width: 60px;
            height: 34px;
            line-height: 34px;
            background: #81a9c3;
            color: #fff;
            outline: none;
            border: 0;
        }

        .content_ {
            line-height: 30px;
            padding: 0 10px;
        }
    </style>
</head>

<body>
    <!-- <div id="wrap">
        <div id="header">
            <h1 @click="onClickLeft">产品扫码</h1>
        </div>
        <div id="main" class="flex-con">
            <div class="scan">
                <input type="text" id="scanCode" />
                <button type="button" id="searchButton">查询</button>
                <button type="button" id="scanButton">扫描</button>
            </div>
            <div class="content">

            </div>
        </div>
        <div id="footer">
            <h5>汇智云创</h5>
        </div>
    </div> -->

    <div id="app" v-cloak>
        <div class="init-full">
            <van-nav-bar class="head" title="产品扫码" left-arrow @click-left="onClickLeft"></van-nav-bar>
            <div class="body-no-bottom">
                <div class="content">
                    <div class="scan">
                        <input type="text" id="scanCode" />
                        <button type="button" id="searchButton" @click="clickSearchButton">查询</button>
                        <button type="button" id="scanButton" @click="clickScanButton">扫描</button>
                    </div>
                    <div class="content_">

                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
<script type="text/javascript" src="../script/jquery.js"></script>
<script type="text/javascript">

    var vm;
    apiready = function () {

        vm = new Vue({
            el: '#app',
            data: {
                showLoading: false
            },
            created: function () {
                var that = this;
            },
            methods: {
                clickSearchButton() {
                    if (!$('#scanCode').val()) {
                        return false;
                    }
                    $('.content_').html('');
                    ajax('APP_PrdctCX', { S_P_QRCode: $('#scanCode').val() }, function (ret) {
                        var data = ret.ds;
                        if (data.length) {
                            if (data[0].status == 200) {
                                var arrayData = data[0].msg.split('$');
                                var html = '';
                                for (var i in arrayData) {
                                    html += '<div>' + arrayData[i] + '</div>';
                                }
                                $('.content_').html(html);
                            } else {
                                alert('未查询到产品');
                            }
                        } else {
                            alert('未查询到产品');
                        }
                    })
                },
                clickScanButton() {
                    var FNScanner = api.require('FNScanner');
                    FNScanner.open({
                        autorotation: true
                    }, function (ret, err) {
                        if (ret) {
                            if (ret.eventType == 'success') {
                                $('.content_').html('');
                                $('#scanCode').val(ret.content);
                                ajax('APP_PrdctCX', { S_P_QRCode: $('#scanCode').val() }, function (ret) {
                                    var data = ret.ds;
                                    if (data.length) {
                                        if (data[0].status == 200) {
                                            var arrayData = data[0].msg.split('$');
                                            var html = '';
                                            for (var i in arrayData) {
                                                html += '<div>' + arrayData[i] + '</div>';
                                            }
                                            $('.content_').html(html);
                                        } else {
                                            alert('未查询到产品');
                                        }
                                    } else {
                                        alert('未查询到产品');
                                    }
                                })
                            }
                        } else {
                            alert('扫描失败');
                            $('#scanCode').val('');
                            $('.content_').html('');
                        }
                    });
                },
                onClickLeft() {
                    api.closeWin();
                }
            }
        })
    };




    

    function ajax(cmd, parm, callback) {
        var url = 'http://106.15.33.39:9981/Frame/SqlData?cmdname=' + cmd + '&platform=' + api.systemType + '【' + api.deviceId + '】';

        api.ajax({
            url: url,
            method: 'post',
            dataType: 'json',
            data: {
                values: parm
            }
        }, function (ret, err) {
            if (ret) {
                if (ret.status == 200) {
                    if (callback) callback(ret.data);
                } else {
                    alert('程序好像出错了,请稍后再试');
                }
            } else {
                alert('程序好像出错了,请稍后再试\n' + 'errcode:' + err.code);
            }
        });
    }
</script>

</html>